<template>
	<a-modal v-model:visible="visible" :title="type == 'add'?'新增':'编辑'" @ok="handleOk" style="width: 80%">
		<a-form
			ref="formRef"
			name="custom-validation"
			:model="addIndexState"
			:rules="rules"
			:labelCol="{span: 2}"
		>
			<a-form-item has-feedback label="标题" name="key">
				<a-input v-model:value="addIndexState.title" placeholder="请输入标题" allowClear />
			</a-form-item>
			<a-form-item has-feedback label="内容" name="key">
				<xn-editor v-model="addIndexState.data" placeholder="请输入邮件正文" :height="500"></xn-editor>
			</a-form-item>
		</a-form>
	</a-modal>
</template>

<script setup>
	import XnEditor from '@/components/Editor/index.vue'
	import {defineProps,defineExpose,defineEmits} from "@vue/runtime-core";
	import menuApi from "@/api/indexMenu/menuApi";
	const emit = defineEmits({ successful: null })
	const visible = ref(false)
	const addIndexState = ref({})
	const type = ref('add')
	const init = (indexMenuId) => {
			type.value = 'add'
			addIndexState.value = {indexMenuId:indexMenuId}
			visible.value = true
	}
	const edit = (row) => {
		type.value = 'edit'
		addIndexState.value = row
	  	visible.value = true
	  	console.log(row)
	}
		const handleOk = () => {
		   if(type.value == 'add'){
			 menuApi.addMenuData(addIndexState.value).then(res=>{
				visible.value = false
				emit('successful')
			 })
		   }else{
			 menuApi.updateMenuData(addIndexState.value).then(res =>{
				visible.value = false
				emit('successful')
			 })
		   }

		}

		defineExpose({
			init,
			edit
		})
</script>

<style scoped>

</style>
